<template>
  <el-dialog
    title="修改回收编码"
    v-model="props.params.visible"
    width="400px"
    append-to-body
    :before-close="cancel"
  >
    <el-form
      :model="addForm"
      ref="addRef"
      :inline="true"
      :rules="addRules"
      label-width="80px"
    >
    <el-form-item label="截至编码" prop="redisValue">
        <el-input
          v-model="addForm.redisValue"
          placeholder="请输入"
          clearable
          style="width: 220px"
        />
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
import { recycleCodeInfo, recycleCode } from "@/api/system/recycleCode";
import { watch } from "vue";
import { userOptionSelect } from "@/api/system/user";
const props = defineProps({
  params: Object,
  visible: Boolean,
});
const emits = defineEmits(["update:visible", "refresh"]);
const { proxy } = getCurrentInstance();
const addForm = ref({
  redisKey: undefined,
  redisValue: undefined,
});
const addRules = {
  redisValue: [{ required: true, message: "截至编码不能为空", trigger: "blur" }],
};

/** 获取商品详情 */
function getDetail() {
  recycleCodeInfo(props.params.id).then((response) => {
    addForm.value = response.data;
  });
}
watch(
  () => props.visible,
  (newVal) => {
    if (newVal) getDetail();
  }
);
/** 重置表单  */
function reset() {
  proxy.resetForm("addRef");
}
/** 用户下拉框 */
const userLoading = ref(false);
const userOptions = ref([]);
async function getUserOption(query) {
  if (query) {
    userLoading.value = true;
    const { data } = await userOptionSelect({ queryKey: query });
    userOptions.value = data.map((i) => {
      const { userId, nickName, userName } = i;
      return {
        value: userName,
        label: `${userId},${nickName},${userName}`,
      };
    });
    userLoading.value = false;
  }
}
getUserOption(" ");
/** 提交按钮 */
function submitForm() {
  proxy.$refs["addRef"].validate((valid) => {
    if (valid) {
      recycleCode(addForm.value).then((response) => {
        proxy.$modal.msgSuccess("修改成功");
        emits("refresh");
        cancel();
      });
    }
  });
}
/** 取消按钮 */
function cancel() {
  emits("update:visible", false);
  reset();
}
</script>
